<template>
  <div v-if="hasAccess">
    <slot />
  </div>
</template>

<script lang="ts" setup>
import { computed } from 'vue'
import { useLoginUserStore } from '@/stores/useLoginUserStore'
import { checkAccess } from '@/access/checkAccess'

interface Props {
  access?: string
  fallback?: boolean
}

const props = withDefaults(defineProps<Props>(), {
  access: undefined,
  fallback: false
})

const loginUserStore = useLoginUserStore()

// 计算是否有权限
const hasAccess = computed(() => {
  if (!props.access) {
    return true
  }
  
  const result = checkAccess(loginUserStore.loginUser, props.access)
  return props.fallback ? !result : result
})
</script>
